<template>
  <!-- 地块信息 制作时间：2024-3-12 -->
  <div class="traceability">
    <!-- 列表 -->
    <div class="tableList">
      <!-- <div class="back" @click="back()">
        <i class="el-icon-back"></i>返回
      </div> -->
      <div class="hasDiv">
        <div class="textCenter">溯源码介绍</div>
        <div class="flexTrace">
          <div class="centerLine">
            <img src="@/assets/images/traceability.png" class="textImage"/>
            <!-- <div class="textImage"></div> -->
          </div>
          <div>
            <div class="mtLeft">
              <div>一、增加消费者信任度，提高消费者从接触到购买的转化率。</div>
            </div>
            <div class="mtLeft">
              <div>二、让消费者知道优质农产品背后的不易，从而为农产品的附加值买单。</div>
            </div>
            <div class="mtLeft">
              <div>三、为优质农产品建立品牌形象，以区别于普通农产品。</div>
            </div>
            <div class="mtLeft">
              <div>四、通过溯源作为入口，把潜在客户导流到自己的公众号或微信群。</div>
            </div>
            <div class="mtLeft">
              <div>五、一旦农产品被消费者认可，溯源会成为消费者引以为豪的谈资和炫耀点，因为他们能知道自己吃的东西是如何生产出来的一让消费者帮你去传播。</div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="addBtn">
      <el-button type="primary" @click="toNext()">
        生成溯源码
      </el-button>
    </div>
  </div>
</template>

<script>
// import { getLandInfoPageApi, delLandInfoApi } from '@/api/agriLand'
// import { getSysSonDictListApi } from '@/api/dict'
export default {
  name: 'traceabilityCreated',
  data () {
    return {
    }
  },
  mounted () {
  },

  methods: {
    // 返回
    back () {
      this.$router.go(-1)
    },
    // 创建溯源码
    toNext () {
      this.$router.push({ path: '/centerindustry/traceability/bind' })
    }
  }
}
</script>

<style lang="scss" scoped>
.redColor {
    color: #F76560
}
.greenColor {
    color: #19B560
}
.back {
  font-size: 0.8vw;
  margin-bottom: 1.5625vw * 0.834;
  width: 5.2083vw;
  cursor: pointer;
  position: absolute;
  left: 0.25rem;
  top: 0.25rem;
}
.tableList {
  display: flex;
  justify-content: center;
  position: relative;
  .hasDiv {
    background: #fff;
    color: #333333;
    width: 950px;
    .textCenter {
      text-align: center;
      padding: 30px 0 70px 0;
      font-size: 24px;
      font-weight: bold
    }
    .flexTrace {
      display: flex;
    }
    .textImage {
      width: 450px;
      height: 310px;
    }
    .centerLine {
      text-align: center;
      display: flex;
    }
    .mtLeft {
      padding: 0 0 0 60px;
      display: flex;
      align-items: baseline;
      line-height: 30px;
    }
    .mtLeft+.mtLeft {
      margin-top: 25px
    }
  }
}
.addBtn {
  margin-top: 150px;
  text-align: center;
  .el-button {
    padding: 10px 40px;
    background: #00C586;
  }
}
</style>
